<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Tiny Talk</title>
</head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<style type="text/css">
    body {
        text-align: center;
        background-color: #d8cdad;

    }

    .box {
        background-image: url(img/bg.png);
        background-position: center;
        background-repeat: no-repeat;
        width: 800px;
        height: 600px;
        margin: 60px auto;
        padding-top: 230px;
        display: block;
        position: relative;
        text-align: center;
    }

    .line {
        width: 400px;
    }


</style>
<body>

<div class="box">
    <div class="form-horizontal line" style="color: red;margin-bottom: 5px;height: 20px" ><strong th:text="${msg}"></strong></div>
    <form class="form-horizontal line" action="#" th:action="@{/web/login}" th:object="${userlogin}"
          method="post">

        <div class="form-group line">
            <label class="col-sm-3 control-label">用户名:</label>
            <div class="col-sm-9">
                <input type="text" th:field="*{name}" class="form-control" placeholder="请输入姓名"/>
            </div>
        </div>
        <div class="form-group line">
            <label class="col-sm-3 control-label">密码:</label>
            <div class="col-sm-9">
                <input type="password" th:field="*{pwd}" class="form-control" placeholder="请输入密码"/>
            </div>
        </div>

        <div class="form-group line">
            <div>
                <button type="submit" class="btn btn-primary" style="margin-right: 60px" id="btn">登陆</button>
                <input type="reset" class="btn btn-warning " value="重置"/>
            </div>
        </div>

    </form>

    <!--<h1>获取对象信息</h1>-->
    <!--<h2>1、通过直接访问对象的方式</h2>-->
    <!--<p th:text="${userInfo.username}"></p>-->
    <!--<p th:text="${userInfo.password}"></p>-->


    <!--<h2>2、通过th:object访问对象的方式</h2>-->
    <!--<div th:object="${userlogin}">-->
        <!--<p th:text="*{id}"></p>-->
        <!--<p th:text="*{name}"></p>-->
        <!--<p th:text="*{pwd}"></p>-->
    <!--</div>-->

    <!--<h1>表单提交</h1>-->
    <!--&lt;!&ndash; 表单提交用户信息,注意字段的设置,直接是*{} &ndash;&gt;-->
    <!--<form action="#" th:action="@{/web/login}" th:object="${userlogin}" method="post">-->
        <!--<input type="text" th:field="*{name}"/>-->
        <!--<input type="text" th:field="*{pwd}"/>-->
        <!--<input type="submit"/>-->
    <!--</form>-->


    <!--<a class="btn_style" id="btn_login"href="javascript:login()" >登陆</a>-->
    <!--<a class="btn_style" id="btn_reset"href="javascript:reset()">重置</a>-->


</div>
</body>
</html>